var web = web || {};
web.Popup = Class.create(); 
web.Popup.prototype = {
	initialize: function(options, parent) {
		var defaults = {
			id: '',
			title: '',
			width: 300,
			height: 0,
			body: {type:'html', val:''},
			drag: true,
			lockScroll: false,
			hasOver: true,
			overlay: {bgcolor:'#000', opacity:0.2},
			onload: function(){},
			onclose: function(){}
		};
		this.settings = $.extend(defaults, options);
		this.ie6 = ($.browser.msie && $.browser.version < 7) ? true : false;
		this.doc = $(document);
		this.win = $(window);
		
		this.parent = parent || null;
		this.overlay = null;
		this.panel = null;
		this.panelIframe = null;
		this.panelDialog = null;
		this.dialogTitle = null;
		this.dialogBody = null;
	},
	show: function() {
		if ('' == this.settings.id) return;
		if (this.settings.lockScroll) this._lockScroll();
		if (this.settings.hasOver) this._showOverlay();
		this._showPanel();
	},
	hide: function() {
		if (this.settings.lockScroll) this._unLockScroll();
		if (this.settings.hasOver) this._hideOverlay();
		this._hidePanel();
	},
	getBodyElement: function(val) {
		return this.dialogBody.find(val);
	},
	_showPanel: function() {
		this.panel = $('#'+ this._getPanelID());
		if (0 == this.panel.size()) {
			this._createPanel();
			this._bindDragEvent();
			this._loadContent();
		}
		this._setPanelPos();
		this.panel.show();
	},
	_hidePanel: function() {
		this.panel.hide();
	},
	_iframeLoaded: function(iframe) {
		this.dialogBody.children('.dialog_loading').remove();
		iframe.show();
		this.settings.onload.call(this);
	},
	_bindDragEvent: function() {
		if (!this.settings.drag) return;
		
		this.dialogTitle.css('cursor', 'move');
		this.panel.drag(function(e, d){
			$(this).css({
				top: d.offsetY,
				left: d.offsetX
			});
		}, {handle:'.dialog_title', not:'a'});
	},
	_loadContent: function() {
		var _this = this;
		if (this.settings.body.type == 'html') {
			this.dialogBody.html(this.settings.body.val);
			this.settings.onload.call(this);
		} else {
			this.dialogBody.html('<div class="dialog_loading">载入中请稍等....</div>');
			
			if (this.settings.body.type == 'page') {
				this.dialogBody.load(this.settings.body.val, function(){
					_this.settings.onload.call(_this);
				});
			} else if (this.settings.body.type == 'iframe') {
				var iframe = $('<iframe scrolling="auto" frameborder="0"></iframe>');
				if ($.browser.msie) {
					var domIframe = iframe.get(0);
					if (domIframe.addEventListener) {
						domIframe.addEventListener('load', function(){_this._iframeLoaded(iframe);}, false);
					} else if (domIframe.attachEvent) {
						domIframe.attachEvent('onload', function(){_this._iframeLoaded(iframe);});
					} else if (domIframe.onLoad) {
						domIframe.onload = function(){_this._iframeLoaded(iframe);};
					}
					
					//var iframeWindow = domIframe.contentWindow || domIframe.contentDocument.parentWindow;
					//(elem.ownerDocument || elem).parentWindow;
				} else {
					iframe.load(function(){
						_this._iframeLoaded(iframe);
					});
				}
				
				iframe.appendTo(this.dialogBody);
				iframe.attr('src', this.settings.body.val);
			}
		}
	},
	_setPanelPos: function() {
		this.panel.css({
			left: parseInt((this.win.width()/2) + this.doc.scrollLeft() - (this.panel.innerWidth()/2)),
			top: parseInt((this.win.height()/2) + this.doc.scrollTop() - (this.panel.innerHeight()/2))
		});		
	},
	_getPanelID: function() {
		return 'popup_panel_'+ this.settings.id;
	},
	_getBorder: function() {
		
	},
	_createPanel: function() {
		var _this = this;
		var warp =	'' +
					'	<div class="dialog_wrap">' +
					'		<div class="dialog_title"><span>'+ this.settings.title +'</span><a title="关闭" href="javascript:{}">关闭</a></div>' +
					'		<div class="dialog_body_wrap"></div>' +
					'	</div>';
					
		var imgBorder = ''+
						'<table border="0" class="img_border">'+
						'	<tr><td class="img_top_left"></td><td class="img_center"></td><td class="img_top_right"></td></tr>'+
						'	<tr><td class="img_center"></td><td valign="top">'+ warp +'</td><td class="img_center"></td></tr>'+
						'	<tr><td class="img_bottom_left"></td><td class="img_center"></td><td class="img_bottom_right"></td></tr>'+
						'</table>';
						
		var cssBorder = '<div class="css_border">'+ warp +'</div>';			
		var dialog = this.ie6 ? imgBorder : cssBorder;
		
		var html = 	'' +
					'<div id="'+ this._getPanelID() +'" class="popup_dialog">' +
					'	<div class="bg_iframe"><iframe src="about:blank"></iframe></div>' + dialog +
					'</div>';
					
		this.panel = $(html);
		this.panelIframe = this.panel.children('.bg_iframe');
		this.panelDialog = this.panel.find('.dialog_wrap');
		this.dialogTitle = this.panelDialog.children('.dialog_title');
		this.dialogBody = this.panelDialog.children('.dialog_body_wrap');
		this.panel.appendTo($(document.body));
		
		this.panelDialog.css({width: this.settings.width});
		this.panelIframe.css({width: this.panel.innerWidth()});
		if (this.settings.height > 0) {
			this.dialogBody.css('height', this.settings.height);
			this.panelIframe.css('height', this.panel.innerHeight());
		}
		
		if (!this.settings.lockScroll) {
			this.win.bind({
				resize: function(){if (_this.panel.is(':visible')) _this._setPanelPos();},
				scroll: function(){if (_this.panel.is(':visible'))_this._setPanelPos();}
			});
		}
		
		var a = this.dialogTitle.children("a");
		a.bind('click', function() {
			_this.hide();
			return false;
		});	
	},
	_lockScroll: function() {
		$('html').addClass('popup_lock_scroll');
	},
	_unLockScroll: function() {
		$('html').removeClass('popup_lock_scroll');
	},
	_showOverlay: function() {
		var _this = this;
		if (null == this.overlay) {
			this.overlay = $('#popup_overlay');
			if (0 == this.overlay.size()) {
				this.overlay = $('<div id="popup_overlay" class="popup_overlay"><iframe src="about:blank"></iframe></div>');
				this.overlay.appendTo($(document.body));
				this.overlay.css({backgroundColor: this.settings.overlay.bgcolor, opacity: this.settings.overlay.opacity, height: $(document).height()});
			}
		}
		this.overlay.fadeIn()
	},
	_hideOverlay: function() {
		this.overlay.hide();	
	}
};

/*
$(window).height();   // returns height of browser viewport
$(document).height(); // returns height of HTML document
*/

(function($){  
	$.fn.formUI = function(options){
		return this.each(function(){
			var from = new web.FormUI(options);
			from.ui($(this));
		});
	}
})(jQuery); 